<template>
	<view class="drugDescribe-wrap">
		<view class="drugDescribe-box1"> 
			<u-title value="开药问诊流程"></u-title>

			<view class="drugDescribe-icon-list">
				<view class="drugDescribe-icon-item">
					<image src="http://k8s.vendingtech.vip/images/data_icon@2x.png" class="pic"></image>
					<view class="txt2">患者填写病情</view>
				</view>

				<view class="drugDescribe-icon-item">
					<image src="http://k8s.vendingtech.vip/images/prescription_icon@2x.png" class="pic"></image>
					<view class="txt2">医生问诊开处方</view>
				</view>

				<view class="drugDescribe-icon-item">
					<image src="http://k8s.vendingtech.vip/images/prescription_icon_yellow@2x.png" class="pic"></image>
					<view class="txt2">药师审核处方</view>
				</view>

				<view class="drugDescribe-icon-item">
					<image src="http://k8s.vendingtech.vip/images/deliver_icon@2x.png" class="pic"></image>
					<view class="txt2">线上购药发货</view>
				</view>

				<view class="mod2"></view>
			</view>
		</view>

		<view class="drugDescribe-box2">
			<u-title value="所患疾病"></u-title>
			<textarea placeholder-class="textarea-place" :maxlength="1000" class="textarea-box" v-model="questionOrderForm.content" placeholder="请输入您所患疾病的名称" />

			<u-title value="肝功能"></u-title>
			<u-check-box  :list="functionList" :value="questionOrderForm.drugQuestionReq.liver" @change="radioChangeType($event, 'liver')"></u-check-box>

			<u-title value="肾功能"></u-title>
			<u-check-box  :list="functionList" :value="questionOrderForm.drugQuestionReq.kidney" @change="radioChangeType($event, 'kidney')"></u-check-box>

			<u-title value="过敏史"></u-title>
			<u-check-box  :list="allergyList" :value="questionOrderForm.drugQuestionReq.allergy" @change="radioChangeType($event, 'allergy')"></u-check-box>
			
			<textarea v-if="questionOrderForm.drugQuestionReq.allergy==1" placeholder-class="textarea-place" :maxlength="1000" class="textarea-box" v-model="questionOrderForm.drugQuestionReq.allergyText" placeholder="请详细描述过敏药物，如青霉素过敏等。" />

			<u-title value="生育状态及计划"></u-title>
			<u-check-box  :list="birthStatusList" :value="questionOrderForm.drugQuestionReq.birthStatus" @change="radioChangeType($event, 'birthStatus')"></u-check-box>
 
			<u-title value="处方凭证"></u-title>

			<view class="drugDescribe-word">开药门诊仅适用于复诊患者，请上传真实处方凭证，否则一切问题由患者负责。</view>

			<u-upload-image v-if="applyShow" :file-list="questionOrderForm.reportList" :limit="9" @on-success="uploadSuccess" @on-error="uploadError" @on-remove="uploadRemove" />
		</view>

		<u-bottom-button value="选择患者信息" @click="save()"></u-bottom-button>
	</view>
</template>

<script>
import uTitle from '@/components/u-title/u-title.vue';
import uBottomButton from '@/components/u-bottom-button/u-bottom-button.vue';
import uCheckBox from '../u-checkbox/u-checkbox.vue';
import uUploadImage from '@//components/u-upload-image/u-upload-image.vue';
import { mapState, mapMutations } from 'vuex';
export default {
	components: {
		uBottomButton,
		uTitle,
		uCheckBox,
		uUploadImage
	},
	computed: {
		...mapState({
			questionOrderForm: state => state.questionOrderForm
		})
	},
	data() {
		return {
			applyShow: true,
		};
	},
	onLoad(option) {},
	onShow() {},
	methods: {
		...mapMutations({
			setQuestionOrderForm: 'setQuestionOrderForm',
			clearQuestionOrderForm: 'clearQuestionOrderForm'
		}),

		uploadSuccess(res) {
			if (res.code == 200) {
				this.questionOrderForm.reportList.push(res.result.url);
				this.setQuestionOrderForm(this.questionOrderForm);
				this.applyShow = false;
				this.applyShow = true;
			} else {
				uni.showToast({
					title: '文件上传失败',
					icon: 'none'
				});
			}
		},
		uploadError(e) {
			uni.showToast({
				title: '文件上传失败',
				icon: 'none'
			});
		},
		uploadRemove(e) {
			this.questionOrderForm.reportList.splice(e, 1);
			this.setQuestionOrderForm(this.questionOrderForm);
			this.applyShow = false;
			this.applyShow = true;
		},
		
		radioChangeType(value, type) {
			if(value!=null){
				this.questionOrderForm.drugQuestionReq[type] = value;
				this.setQuestionOrderForm(this.questionOrderForm)
				
			}
		},
		save() {
			if (this.questionOrderForm.content) {
				this.gotoRouter('/pages-member/patientList/patientList?type=' + this.questionOrderForm.type);
			} else {
				uni.showToast({
					title: '请描述您的病情',
					icon: 'none'
				});
			}
		}
	}
};
</script>

<style lang="less">
@import './drugDescribe.less';
</style>
